<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <script src="lib/js/vue.js" type="text/javascript" charset="utf-8"></script>


</head>
<body>
<div id="app">
    {{ msg }}
    <my-com1></my-com1>
    <myyyy></myyyy>
    <myyyyyy></myyyyyy>
</div>




<template id="ss">
    <h3>{{ msg }}</h3>
</template>
<script>
    Vue.component('myyyy',{
        template:'<h2>这是第二个组件</h2>'
    })

    Vue.component('myyyyyy',Vue.extend({
        template:'<h5>这是extend的方法</h5>'
    }))

    // 创建一个vue实例
    new Vue({
        el:'#app',
        data:{
            msg:'信息'
        },
        methods:{

        },
        components:{
            'my-com1':{
                template: '#ss',
                data() {
                    return {
                        msg:'这是一个东西'
                    }
                }
            }
        }
    })
</script>
</body>
</html>
